Créer une image map

Une image map est une image dont certaines zones sont cliquables pour aller sur un lien.

Créer le code d'une image map est assez complexe et peut être généré grâce à un générateur en ligne comme celui là : https://www.image-map.net/

Exemple d'une carte d'Europe de l'Ouest cliquable uniquement sur la zone de la France :

            
                <img src="images/europe.png" usemap="#image-map">

                <map name="image-map">
                    <area target="_blank" alt="Page Wikipédia de la France" title="Page Wikipédia de la France" href="https://fr.wikipedia.org/wiki/France" coords="354,704,378,726,405,726,417,721,429,728,437,728,447,741,471,735,471,717,475,707,502,700,526,699,534,699,543,708,556,712,568,714,585,706,601,688,605,671,587,668,589,654,582,646,595,633,587,617,593,607,588,593,567,594,563,589,576,580,581,568,592,553,607,545,610,526,616,506,625,496,605,486,592,487,580,480,563,475,548,473,535,465,529,453,520,460,509,448,494,441,482,430,471,430,466,419,454,429,452,453,422,465,411,483,390,483,383,469,366,467,368,479,376,502,363,507,345,509,327,499,315,504,302,504,279,515,290,539,321,542,335,550,346,558,355,573,365,587,380,607,379,617,377,640,374,663,368,686" shape="poly">
                </map>
            
        

Résultat du code ci-dessus :

Page Wikipédia de la France